<%@ page language="java" pageEncoding="utf-8"%>
<%@page import="com.farm.web.constant.FarmConstant"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="/view/conf/farmtag.tld" prefix="PF"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<base href="<PF:basePath/>" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>参数表单测试- <PF:ParameterValue key="config.sys.title" /></title>
<meta name="description"
	content='<PF:ParameterValue key="config.sys.mate.description"/>'>
<meta name="keywords"
	content='<PF:ParameterValue key="config.sys.mate.keywords"/>'>
<meta name="author"
	content='<PF:ParameterValue key="config.sys.mate.author"/>'>
<meta name="robots" content="index,follow">
<meta name="viewport"
	content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<jsp:include page="/view/web-simple/atext/include-web.jsp"></jsp:include>
<script src="text/lib/ace/ace.js" type="text/javascript" charset="utf-8"></script>
<style>
<!--
.wuc-userinfo th {
	min-width: 100px;
}
-->
</style>
</head>
<body>
	<div class="container-fluid">
		<div class="row">
			<!-- 导航 -->
			<jsp:include page="/view/web-simple/commons/head.jsp"></jsp:include>
		</div>
	</div>
	<div class="container-fluid "
		style="background-color: #eceef1; padding-top: 80px; padding-bottom: 50px;">
		<div class="container" style="margin-bottom: 50px;">
			<div class="row">
				<div class="row">
					<div class="col-md-8">
						<div id="loadPageId">
							<c:if test="${empty forms}">
								<div>无内置参数，可以直接启动</div>
							</c:if>
							<c:forEach items="${forms}" var="node">
								<div class="form-group">
									<label for="exampleInputEmail1">${node.name}:${node.innercode}</label>
									<textarea name="${node.innercode}"  placeholder="${node.pcontent}" class="form-control"></textarea>
								</div>
							</c:forEach>
							<button onclick="submitTestParas()" class="btn btn-default">调用表单</button>
						</div>
					</div>
					<div class="col-md-4">
						<pre id="editor"
							style="padding: 0px; margin: 0px; height: 500px; border: 0px; width: 100%;">123</pre>
					</div>
					<script type="text/javascript">
						function submitTestParas() {
							let objectArray = [];
							$('.form-control', '#loadPageId').each(
									function(i, obj) {
										objectArray.push({
											name : $(obj).attr('name'),
											val : $(obj).val()
										});
									});
							$('#loadPageId').load('${formUrl}', {
								'testparas' : JSON.stringify(objectArray)
							});
						}
						function submitParas() {
							let objectArray = [];
							$('.form-control', '#loadPageId').each(
									function(i, obj) {
										if($(obj).attr('type')=='checkbox'){
											objectArray.push({
												name : $(obj).attr('name'),
												val :String($(obj).is(':checked'))
											});
										}else{
											objectArray.push({
												name : $(obj).attr('name'),
												val : $(obj).val()
											});
										}
									});
							$.post('${formSubmitUrl}', {
								'paras' : JSON.stringify(objectArray)
							}, function(flag) {
								cbtg_editor.setValue( flag.json);
							}, 'json');

						}
					</script>
				</div>
			</div>
		</div>
	</div>
	<div class="container-fluid" style="padding: 0px;">
		<!-- 页脚 -->
		<jsp:include page="/view/web-simple/commons/foot.jsp"></jsp:include>
	</div>
</body>
<script type="text/javascript">
	var cbtg_editor;
	$(function() {
		cbtg_editor = ace.edit("editor", {
			theme : "ace/theme/tomorrow_night_eighties",
			mode : "ace/mode/html",
			wrap : true,
			autoScrollEditorIntoView : true
		});
		cbtg_editor.setTheme("ace/theme/twilight");
		cbtg_editor.session.setMode("ace/mode/json");
		cbtg_editor
				.setValue("参数展示区");
		cbtg_editor.setReadOnly(true);
	});
</script>
</html>